<template>
  <view class="nav-tar" :style="{paddingTop: navBar.statusBarHeight + 'px', height: navBar.navHeight + 'px'}">
    <view class="title" v-if="false">{{home.app_name}}</view>
    <view class="search">
      <u-search placeholder="请输入关键字" :height="'56rpx'" :searchIconSize="'44rpx'"
                v-model="keyword"
                @search="goSearch"
                @custom="goSearch"
                :showAction="false" actionText="搜索" :borderColor="activeColor"></u-search>
    </view>
  </view>
</template>

<script>
import color from '../../../../config/color'
export default {
  props: ['home', 'navBar'],
  data() {
    return {
      activeColor: color.main_color,
      keyword: ''
    }
  },
  methods: {
    // 跳转到搜索页面
    goSearch() {
      uni.navigateTo({
        url: `/sub_common/search/index?keyword=${this.keyword}`
      })
    }
  },
  created() {

  },
  mounted() {
  },

}
</script>

<style scoped lang="scss">
.nav-tar {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding-left: 20rpx;
  padding-right: 20rpx;
  background: $main_color;
  .title {
    font-size: 24rpx;
    //background: red;
    width: 120rpx;
    color: white;
  }
  .search {
    width: 400rpx;
    /* #ifdef APP-PLUS || H5 */
    flex: 1;
    /* #endif */
  }
}
</style>
